<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="./address-selector.js"></script>
</head>
<body>

<div><input type="text" value="" name="kladr_region[name]"></div>
<div><input type="text" value="" name="kladr_subregion[name]"></div>
<div><input type="text" value="" name="field_city" id="field_city"></div>

<script>
    function onClick()
    {
    // plugin init
    // level, code, name, gninmb, index, okatd
    AddressSelector(
        { // fields
            'kladr_region[name]':'Region.name',
            'kladr_subregion[name]':'SubRegion.name',
            'field_city':'City.name'
        },
        { // options
            level: 'City', // County, Region, SubRegion, City
            popup_id: 'address-selector',
            onSelect: function(data)
                {
                    //alert(data.city.name);
                },
            baseurl: './data'
        });
    }

    var e = document.getElementById('field_city');
    //e.addEventListener('focus', onClick, false);
    e.onclick = onClick;
</script>

<a href="#" class="address-selector-link" onclick="onClick(); return false;">Select...</a>
</body>
</html>
